<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"
        />
        <script type="text/javascript" src="/Extjs/bootstrap.js"></script>
        <script type="text/javascript" src="/Extjs/extux.js"></script>
        <link rel="stylesheet" type="text/css" href="/Extjs/resources/css/ext-all.css"
        />
        <link href="/Extjs/ux/grid/css/RangeMenu.css" rel="stylesheet" type="text/css"
        />
        <link href="/Extjs/ux/grid/css/GridFilters.css" rel="stylesheet" type="text/css"
        />
        <link rel="stylesheet" type="text/css" href="/css/main.css" />
        <script type="text/javascript" src="/Extjs/locale/ext-lang-zh_CN.js"></script>
        <script type="text/javascript">
            //<!--

            Ext.Loader.setConfig({
                enabled: true
            });

            Ext.Loader.setPath('Ext.ux', '/Extjs/ux');

            Ext.require([

            'Ext.grid.*',

            'Ext.data.*',

            'Ext.dd.*',

            'Ext.ux.grid.FiltersFeature',

            'Ext.toolbar.Paging'

            ]);

            Ext.onReady(function () {
                Ext.define('Field', {
                    extend: 'Ext.data.Model',
                    fields: ['name', 'type',
                    {
                        name: 'nullable',
                        type: 'bool'
                    }, {
                        name: 'oname',
                        type: 'hidden'
                    }]
                });

                var field_store = Ext.create("Ext.data.Store", {
                    "storeId": "field_store",
                    "model": 'Field',
                    "autoLoad": true,
                    "pageSize": 10,
                    "proxy": {
                        "type": "ajax",
                        "url": "/modeling/fields/name/<?=$this->entity?>",
                        "reader": {
                            "type": "json",
                            "root": "source",
                            "totalProperty": "totalCount"
                        }
                    },
                    listeners: {
                        update: function (store, record) {
                            Ext.Ajax.request({
                                url: "/modeling/updatefield/entity/<?=$this->entity?>",
                                params: {
                                    'name': record.get('name'),
                                    'type': record.get('type'),
                                    'nullable': record.get('nullable'),
                                    'oname': record.get('oname')
                                },
                                success: function (response, opts) {
                                    store.load();
                                    Extux.msg('success', '');
                                },
                                failure: function (form, action) {
                                    Extux.msg('failed', '');
                                }
                            });
                        },
                        remove: function (store, record) {
                            Ext.Ajax.request({
                                url: "/modeling/removefield/entity/<?=$this->entity?>",
                                params: {
                                    'name': record.get('oname')
                                },
                                success: function (response, opts) {
                                    Extux.msg('success', '');
                                },
                                failure: function (form, action) {
                                    Extux.msg('failed', '');
                                }
                            });
                        }
                    }
                });

                var field_rowEditing = Ext.create('Ext.grid.plugin.RowEditing', {
                    clicksToMoveEditor: 1,
                    autoCancel: false
                });

                var field_grid = Ext.create("Ext.grid.Panel", {
                    "store": "field_store",
                    frame: true,
                    width: 400,
                    height: 400,
                    "columns": [{
                        "text": "name",
                        "dataIndex": "name",
                        editor: {
                            allowBlank: false
                        }
                    }, {
                        "text": "type",
                        "dataIndex": "type",
                        editor: {
                            xtype: 'combobox',
                            typeAhead: true,
                            triggerAction: 'all',
                            listConfig: {
                                emptyText: ''
                            },
                            forceSelection: true,
                            selectOnTab: true,
                            store: [
                                ["string", "string"],
                                ["integer", "integer"],
                                ["boolean", "boolean"],
                                ["date", "date"],
                                ["float", "float"],

                                ],
                            lazyRender: true,
                            listClass: 'x-combo-list-small'
                        }
                    }, {
                        "text": "nullable",
                        "dataIndex": "nullable",
                        field: {
                            xtype: 'checkbox'
                        }
                    }],
                    "dockedItems": [{
                        "xtype": "toolbar",
                        "dock": "top",
                        "items": [{
                            "text": "add",
                            "iconCls": "icon-add",
                            "handler": function () {
                                field_rowEditing.cancelEdit();
                                var r = Ext.create('Field', {
                                    name: '',
                                    oname: '',
                                    type: 'string',
                                    nullable: false
                                });

                                field_store.insert(0, r);
                                field_rowEditing.startEdit(0, 0);
                            }
                        }, {
                            "text": "delete",
                            "iconCls": "icon-delete",
                            "disabled": true,
                            "id": "delete",
                            "handler": function () {
                                var sm = field_grid.getSelectionModel();
                                field_rowEditing.cancelEdit();
                                field_store.remove(sm.getSelection());
                                if (field_store.getCount() > 0) {
                                    sm.select(0);
                                }
                            }
                        }]
                    }],
                    plugins: [field_rowEditing],
                    "listeners": {
                        'selectionchange': function (view, records) {
                            field_grid.down('#delete').setDisabled(!records.length);
                        }
                    }

                });

                Ext.define('Many2One', {
                    extend: 'Ext.data.Model',
                    fields: ['field', 'target-entity',
                    {
                        name: 'oname',
                        type: 'hidden'
                    }]
                });

                var many2one_store = Ext.create("Ext.data.Store", {
                    "storeId": "many2one_store",
                    "model": 'Many2One',
                    "autoLoad": true,
                    "pageSize": 10,
                    "proxy": {
                        "type": "ajax",
                        "url": "/modeling/many2one/name/<?=$this->entity?>",
                        "reader": {
                            "type": "json",
                            "root": "source",
                            "totalProperty": "totalCount"
                        }
                    },
                    listeners: {
                        update: function (store, record) {
                            Ext.Ajax.request({
                                url: "/modeling/updatemany2one/entity/<?=$this->entity?>",
                                params: {
                                    'field': record.get('field'),
                                    'target-entity': record.get('target-entity'),                                    
                                    'oname': record.get('oname')
                                },
                                success: function (response, opts) {
                                    store.load();
                                    Extux.msg('success', '');
                                },
                                failure: function (form, action) {
                                    Extux.msg('failed', '');
                                }
                            });
                        },
                        remove: function (store, record) {
                            Ext.Ajax.request({
                                url: "/modeling/removemany2one/entity/<?=$this->entity?>",
                                params: {
                                    'field': record.get('oname')
                                },
                                success: function (response, opts) {
                                    Extux.msg('success', '');
                                },
                                failure: function (form, action) {
                                    Extux.msg('failed', '');
                                }
                            });
                        }
                    }
                });
                var many2one_rowEditing = Ext.create('Ext.grid.plugin.RowEditing', {
                    clicksToMoveEditor: 1,
                    autoCancel: false
                });
                
                var many2one_grid = Ext.create("Ext.grid.Panel", {
                    store: 'many2one_store',
                    frame: true,
                    width: 400,
                    height: 400,
                    columns: [{
                        "text": "field",
                        "dataIndex": "field",
                        editor: {
                                allowBlank: false
                        }
                    }, {
                        "text": "target-entity",
                        "dataIndex": "target-entity",
                        flex: 1,
                        editor: {
                            xtype: 'combobox',
                            typeAhead: true,
                            triggerAction: 'all',
                            listConfig: {
                                emptyText: ''
                            },
                            forceSelection: true,
                            selectOnTab: true,
                            store: [
                                <?php foreach ($this->models as $m):?>
                                ["<?= $m['name']?>", "<?= $m['displayname']?>"],
                                <?php endforeach;?>
                                ],
                            lazyRender: true,
                            listClass: 'x-combo-list-small'
                        }                    
                    }],
                    "dockedItems": [{
                        "xtype": "toolbar",
                        "dock": "top",
                        "items": [{
                            "text": "add",
                            "iconCls": "icon-add",
                            "handler": function () {
                            	many2one_rowEditing.cancelEdit();
                                var r = Ext.create('Many2One', {
                                    field: '',
                                    oname: ''                                   
                                });

                                many2one_store.insert(0, r);
                                many2one_rowEditing.startEdit(0, 0);
                            }
                        }, {
                            "text": "delete",
                            "iconCls": "icon-delete",
                            "disabled": true,
                            "id": "delete",
                            "handler": function () {
                                var sm = many2one_grid.getSelectionModel();
                                many2one_rowEditing.cancelEdit();
                                many2one_store.remove(sm.getSelection());
                                if (many2one_store.getCount() > 0) {
                                    sm.select(0);
                                }
                            }
                        }]
                    }],
                    plugins: [many2one_rowEditing],
                    "listeners": {
                        'selectionchange': function (view, records) {
                        	many2one_grid.down('#delete').setDisabled(!records.length);
                        }
                    }

                });                

                Ext.define('Many2Many', {
                    extend: 'Ext.data.Model',
                    fields: ['field', 'target-entity',
                    {
                        name: 'oname',
                        type: 'hidden'
                    }]
                });

                var many2many_store = Ext.create("Ext.data.Store", {
                    "storeId": "many2many_store",
                    "model": 'Many2Many',
                    "autoLoad": true,
                    "pageSize": 10,
                    "proxy": {
                        "type": "ajax",
                        "url": "/modeling/many2many/name/<?=$this->entity?>",
                        "reader": {
                            "type": "json",
                            "root": "source",
                            "totalProperty": "totalCount"
                        }
                    },
                    listeners: {
                        update: function (store, record) {
                            Ext.Ajax.request({
                                url: "/modeling/updatemany2many/entity/<?=$this->entity?>",
                                params: {
                                    'field': record.get('field'),
                                    'target-entity': record.get('target-entity'),                                    
                                    'oname': record.get('oname')
                                },
                                success: function (response, opts) {
                                    store.load();
                                    Extux.msg('success', '');
                                },
                                failure: function (form, action) {
                                    Extux.msg('failed', '');
                                }
                            });
                        },
                        remove: function (store, record) {
                            Ext.Ajax.request({
                                url: "/modeling/removemany2many/entity/<?=$this->entity?>",
                                params: {
                                    'field': record.get('oname')
                                },
                                success: function (response, opts) {
                                    Extux.msg('success', '');
                                },
                                failure: function (form, action) {
                                    Extux.msg('failed', '');
                                }
                            });
                        }
                    }
                });
                var many2many_rowEditing = Ext.create('Ext.grid.plugin.RowEditing', {
                    clicksToMoveEditor: 1,
                    autoCancel: false
                });
                
                var many2many_grid = Ext.create("Ext.grid.Panel", {
                	store: 'many2many_store',
                    frame: true,
                    width: 400,
                    height: 400,
                    columns: [{
                        "text": "field",
                        "dataIndex": "field",
                        editor: {
                                allowBlank: false
                        }
                    }, {
                        "text": "target-entity",
                        "dataIndex": "target-entity",
                        flex: 1,
                        editor: {
                            xtype: 'combobox',
                            typeAhead: true,
                            triggerAction: 'all',
                            listConfig: {
                                emptyText: ''
                            },
                            forceSelection: true,
                            selectOnTab: true,
                            store: [
                                <?php foreach ($this->models as $m):?>
                                ["<?= $m['name']?>", "<?= $m['displayname']?>"],
                                <?php endforeach;?>
                                ],
                            lazyRender: true,
                            listClass: 'x-combo-list-small'
                        }                    
                    }],
                    "dockedItems": [{
                        "xtype": "toolbar",
                        "dock": "top",
                        "items": [{
                            "text": "add",
                            "iconCls": "icon-add",
                            "handler": function () {
                            	many2many_rowEditing.cancelEdit();
                                var r = Ext.create('Many2Many', {
                                    field: '',
                                    oname: ''                                   
                                });

                                many2many_store.insert(0, r);
                                many2many_rowEditing.startEdit(0, 0);
                            }
                        }, {
                            "text": "delete",
                            "iconCls": "icon-delete",
                            "disabled": true,
                            "id": "delete",
                            "handler": function () {
                                var sm = many2many_grid.getSelectionModel();
                                many2many_rowEditing.cancelEdit();
                                many2many_store.remove(sm.getSelection());
                                if (many2many_store.getCount() > 0) {
                                    sm.select(0);
                                }
                            }
                        }]
                    }],
                    plugins: [many2many_rowEditing],
                    "listeners": {
                        'selectionchange': function (view, records) {
                        	many2many_grid.down('#delete').setDisabled(!records.length);
                        }
                    }
                });

                Ext.create("Ext.tab.Panel", {
                    "renderTo": "form",
                    "items": [{
                        "id": "tab_fields",
                        "title": "fields",
                        "items": [
                        field_grid],
                        "closable": false,
                        "disabled": false
                    }, {
                        "id": "tab_many2one",
                        "title": "many-to-one",
                        "items": [
                        many2one_grid],
                        "closable": false,
                        "disabled": false
                    },  {
                        "id": "tab_many2many",
                        "title": "many-to-many",
                        "items": [
                        many2many_grid],
                        "closable": false,
                        "disabled": false
                    }]
                });

            });
            //-->
        </script>
    </head>
    
    <body>
        <div id="form"></div>
    </body>

</html>